/**
 * 注意，它们可以从两个包中获取，一个是"@reduxjs/toolkit/query"，还有一个是"@reduxjs/toolkit/query/react"
 * 此处需要的是第二个
 * 第二个是自动生成，专门提供给react的包，对应于定义请求接口的hook
 */
import {createApi, fetchBaseQuery} from "@reduxjs/toolkit/query/react";

// 定义单个 API Slice 对象
export const apiSlice = createApi({
  // 缓存减速器预计将添加到 state.api （已经默认 - 这是可选的）
  reducerPath: 'api',
  // 所有的请求都有以：'/fakeApi' 开头的URL
  baseQuery: fetchBaseQuery({
    baseUrl: '/fakeApi'
  }),
  tagTypes: ['Post'], // 声明数据类型的字符串签名数组
  // 'endpoints'代表对该服务器的操作和请求
  endpoints: build => ({
    // getPosts endPoint 是一个返回数据的Query操作
    getPosts: build.query({
      // 请求的URL是'/fakeApi/posts'
      query: () => '/posts',
      providesTags: ['Post'] // 描述该查询中数据的标签
    }),
    getPost: build.query({
      query: postId => `/posts/${postId}`
    }),
    addNewPost: build.mutation({
      query: initialPost => ({
        url: '/posts',
        method: 'POST',
        body: initialPost
      }),
      invalidatesTags: ['Post'] // 列出每次Mutations运行时失效的一组标签
    }),
    editPost: build.mutation(({
      query: (post) => ({
        url: `/posts/${post.id}`,
        method: 'PATCH',
        body: post
      })
    }))
  })
})

// 为getPosts Query endpoint 导出自动生成的 hook
export const {
  useGetPostsQuery,
  useGetPostQuery,
  useAddNewPostMutation,
  useEditPostMutation
} = apiSlice
